<template>
  <div class="head">
    <div class="head-left">
      <van-icon class-prefix="icon" name="fenlei" size="17"></van-icon>
      <span>分类</span>
    </div>
    <div class="head-right" @click="$router.push('/search')">
      <div class="search">
        <van-icon class-prefix="icon" name="sousuo"></van-icon>
        请搜索
      </div>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.head{
  width:100%;
  height: 46px;
  background-color:#add;
  color: white;
  font-size: 14px;
  display:flex;
align-items: center;
  position:fixed;
  left: 0;
  top:0;
  z-index:1000;
  box-sizing: border-box;
  padding-right: 8px;
  &-left{
    color: yellow;
    display: flex;
    flex-direction: column;
    align-content: center;
   align-items: center;
    padding: 8px;
  }
  &-right{
    display: flex;
    align-items: center;
    flex: 1;
    height: 30px;
    border-radius: 15px;
    padding-left:8px ;
    background-color: rgb(198, 222, 228);
  }
  }
</style>
